Ann Huang's profile

Morning Owl Prototyping

MORNING OWL PROTOTYPING 2015
 
Team: Diana Chin, Ann Huang, Elaine Zhao
Tools: Adobe Illustrator, Adobe InDesign, Axure, Marvel
Methods: Card Sort, User Testing, Think Aloud, Interview
Role: Concept Development, Market Researcher, Interaction Designer, Prototyper
Final Deliverable: Interactive prototype, promotional video, poster, and presentation/demonstration
 
Recent research has shown that a full night of disrupted sleep can leave recent parents and on-call workers with the same mood, attention span, and alertness as someone who had only slept four hours the previous night. While recent parents and on-call workers may not be able to control their interruptions, everyone else has the potential to improve their sleep quality by identifying and correcting their sleep disruptions. 
 
Although traditional sleep clinics evaluate sleep quality in remote centers, truly understanding a person’s sleep requires being within their actual rest environment. The original Lullaby system, consisting of a sensor suite and tablet application, bridged this gap by capturing the user’s nighttime environment with sensors, making the data accessible via a tablet application. We saw an opportunity to improve Lullaby by eliminating sensor bulkiness and adding actionable feedback. This project was sponsored by UW HCDE professor Julie Kientz.
 
Original Lullaby system
Design Question
 
How can we redesign Lullaby as an accessible mobile smartphone application to support people in the identification of their environmental sleep disrupters?
 
RESEARCH
 
Literature Review and Competitive Analysis
 
Prior to beginning our ideation phase, our team wanted to familiarize ourselves with the current research and competitive landscape in the field of sleep technology. On the academic side, we were able to leverage Lullaby’s original design and research by reading three papers authored by Lullaby’s creators, Kay and Choe et al. These papers on supporting healthy sleep behavior and understanding the sleep environment were the foundation of our features, highlighting both the desires of users to have consistent sleep and their reluctance to engage with systems requiring additional sensors or manual entry.
We also explored the competitive landscape of sleep-related applications. From alarm setting applications to wearables with sleep analysis features, the smartphone domain is full of various tools for sleep tracking and improvement. We categorized eighteen applications by their sensor usage (“Phone Sensors Only”, “Wearable Sensors”, and “Additional Sensors Accessories”) and used Choe et al.’s design framework for supporting healthy sleep behaviors to evaluate each. By doing so, we ended up with a competitive analysis with each application’s goals, features, sources, technology platforms, stakeholders, and input mechanisms. We identified both useful and troublesome aspects of each competitor, finding that the most popular applications were ones that had automated data collection, simple interfaces, and clear data visualizations.
Personas
 
Choe et al. conducted a series of sleep-related surveys and found that common goals of participants included improving consistency of sleep patterns, breaking bad sleep habits, and becoming a morning person. She also found the participants most interested in using a sleeping application were the ones most likely to experience sleep related issues ranging from anxiety to insomnia to trouble waking up. Based on our academic research and competitive analysis, we developed two personas. Our team decided to brand our product as Morning Owl with the tagline "Sleep Smarter. Do Better." to appeal to both morning birds and night owls.
IDEATION and CARD SORT
 
With our personas in mind, we reviewed our competitive analysis matrix to compile a list of potential sleep application features as well as a list of things to avoid. We conducted a card sort of our ideas and came up with these goals. 
 
Show effects of user environment on sleep quality 
 
One key finding from our literature review was the importance of providing actionable suggestions. For Amy, our morning bird, living in a busy household may mean that her eight hours of sleep are interrupted by the proximity of her family and pets. While the Lullaby system recorded both environmental and sleep data, we wanted to easily find associations in the data and teach users how to improve their sleep environment.
 
Goal tracking and motivation 
 
Wearables are used as a measuring tool for most users and sleep is no exception. Our application should allow users to set goals for their sleep quality and track their achievements in an entertaining and motivating way.
 
Personal settings
 
Our literature review also highlighted the privacy concerns inherent in recording environmental data. Due to the personal nature of sleep data, our application must allow for privacy controls and personal settings. This could include the option to turn off data tracking at certain times, deletion of past data, or picking the types of data to be associated (light, noise, temperature, etc.).
 
Ease of Use
 
The original Lullaby system's sensitivity and bulk caused user dissatisfaction, with feedback requesting a more accessible system. In addition to moving Lullaby from a sensor suite to a phone application, we wanted to leverage the sensor features of the modern smart phone and create an intuitive interface that even Oscar the night owl can use as he stumbles to bed after a long night.
 
PROTOTYPES & USER TESTING
Various paper prototypes
We began our prototyping on lo-fidelity paper, with each team member sketching out various ideas and pitching them to the team. After deciding which sketches to use and finalizing both the navigation and application workflow, we converted our paper prototype to Axure. Our initial mid-fidelity Axure prototype included full functionality but minimal color/design in order to allow for parallel testing and design schedules.
 
Usability Testing
 
Mid-fidelity Axure prototype
Our team designed and conducted two iterative usability tests using our interactive Axure prototype. We recruited both student and professional participants and asked them to explore the application while using the Think Aloud protocol, followed by a verbal questionnaire and a series of matched tasks and comprehension questions. We took the findings from our first usability test with 6 participants and adjusted our prototype before re-testing with 5 new participants. We had a number of findings that were incorporated into our final design and will highlight two of them below.
 
Key Finding 1
In our paper prototypes and initial design, we played around with the idea that pressing the moon icon in the bottom tab bar would show a mouseover effect that would allow access to all alarm features. Our first usability test showed that 2/6 users were unable to locate the alarm feature with this positioning and one user commented that they would expect the alarm to be under the Settings menu.
 
In response, we moved the alarm feature to the Settings menu for our second usability test. Once again, however, 2/5 users were unable to find the alarm. We rethought our design and realized that the alarm may be one of the most frequently used features in our application, meaning that it should be displayed prominently and easily accessible. In our final design, the alarm clock is one of the main options from the application home screen.
 
Key Finding 2
Our weekly sleep data view has a lot of information on it, so we initially tried to keep the interface uncluttered by just having two times on the axis. However, during our first usability test, 5/6 participants were confused about how to read the y-axis, thinking that the data represented was for 7am to 11pm. In response to this feedback, we reversed the order of the data and distinctly labelled the hours in our second Axure iteration. 5/5 participants were able to understand the y-axis in our second test, showing that our change improved the clarity of our interface.
FINAL DESIGN
 
While we iterated on our mid-fidelity prototype, we also worked on the visual design of our final product. In particular, we tried out a variety of colors schemes and customization ideas. In the end, we settled with a calming blue-based background with muted colors. As seen below, we also added a light cityscape to the background of the application based on GPS location to add a personalized touch to the interface. Our complete workflow document is also available online.
 
After finishing our hi-fidelity prototype in Marvel, we created the poster below and recorded a promotional video for Morning Owl. These were both presented at the UW HCDE Capstone Showcase, where we won Honorable Mention.
Morning Owl Prototyping
Published:

Morning Owl Prototyping

Morning Owl is a mobile application designed to help you learn how to sleep better by using your wearable and smartphone together to monitor how Read More

Published: